<template>
  <div>
    <div class="header">
      <h2>出租方列表一览</h2>
    </div>
    <!-- 搜索 -->
    <div>
      <el-input class="userInput" v-model="input" placeholder="请输入内容"></el-input>
      <el-select class="userInput" v-model="value" placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        ></el-option>
      </el-select>
      <el-button type="warning" @click="serchUser({input,value,rent})">搜索</el-button>
    </div>
    <!-- 渲染列表 -->
    <div>
      <el-table :data="UserList" style="width: 100%">
        <el-table-column prop="name" label="姓名" min-width="10%"></el-table-column>
        <el-table-column prop="idNumber" label="身份证" min-width="30%"></el-table-column>
        <el-table-column prop="phone" label="电话号码" min-width="30%"></el-table-column>
        <el-table-column prop="authentication" label="审核状态" min-width="20%"></el-table-column>
         <el-table-column prop="money" label="金额" min-width="20%"></el-table-column>
        <el-table-column label="操作" min-width="10%">
          <template slot-scope="scope" >
            <el-button
               @click.native.prevent="requestUserByAuthentication(scope.$index)"
              type="text"
              size="small"
            >审核</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import { createNamespacedHelpers } from "vuex";
const {
  mapState,
  mapGetters,
  mapMutations,
  mapActions
} = createNamespacedHelpers("user");
export default {
  components: {},
  props: {},
  data() {
    return {
      options: [
        {
          value: "name",
          label: "姓名"
        },
        {
          value: "phone",
          label: "手机号"
        }
      ],
      value: "",
      input: "",
      rent:'rent'
    };
  },
  created() {},
  mounted() {
    this.getAllUser("rent");
  },
  computed: {
    ...mapState(["UserList"])
  },
  methods: {
    ...mapActions(["getAllUser", "serchUser","requestUserByAuthentication"]),
  }
};
</script>
<style lang="less" scoped>
@import "../../assets/less/user/LessorsUser.less";
.userInput {
  width: 20%;
  margin: 2% 2%;
}
</style>